/*
 * @Author: liuzehai
 * @Date: 2021-05-10 15:38:10
 * @LastEditTime: 2021-05-10 15:42:33
 * @LastEditors: liuzehai
 * @FilePath: /Card-to-payh5/src/directive/index.js
 * @Description: 由liuzehai创建！
 */
import Vue from "vue";

Vue.directive('phone', {
  inserted(el, binding) {
    el.addEventListener('input', function(e) {
      const reg = /\d/;
      const oldValue = e.target.value;
      const value = e.data;
      if (!value) return;
      if(!reg.test(value) || oldValue.length > 11) e.target.value = oldValue.slice(0, oldValue.length - value.length);
    })
  }
})

Vue.directive('idcard', {
  inserted(el, binding) {
    el.addEventListener('input', function(e) {
      const oldValue = e.target.value;
      const value = e.data;
      const reg = /\d/;
      if (oldValue.length == 18 || oldValue.length == 15
          && (value.endsWith('x') || value.endsWith('X'))) return;
      if(!reg.test(value) || oldValue.length > 18) e.target.value = oldValue.slice(0, oldValue.length - value.length);
    })
  }
})

Vue.directive('dbClick', {
  inserted(el, binding) {
    el.addEventListener('click', e => {
      const iEle = document.createElement('i');
      iEle.classList = 'el-icon-loading'
      if (!el.disabled) {
        const oldValue = el.children[0].innerText;
        el.disabled = true;
        el.children[0].innerText = binding.value || '保存中...';
        el.insertBefore(iEle, el.firstElementChild);
        el.style.cursor = 'wait';
        setTimeout(() => {
          iEle.remove();
          el.style.cursor = 'pointer';
          el.disabled = false;
          el.children[0].innerText = oldValue;
        }, 1000)
      }
    })
  }
});